Properties |
HTMLCanvasElement | - canvas
- The canvas attribute must return the
value it was initialized to when the object was created.
|
SVGMatrix | - currentTransform
- The currentTransform, on
getting, must return the last object that it was set to. On setting, its value must be changed to
the new value, and the transformation matrix must be updated to match the matrix described by the
new value. When the CanvasRenderingContext2D object is created, the currentTransform attribute must be set a newly
created SVGMatrix object.
|
DOMString | - direction
- The direction IDL attribute, on
getting, must return the current value. On setting, if the value is one of ltr, rtl, or inherit, then the value must be changed to the new
value. Otherwise, the new value must be ignored. When the object implementing the
CanvasDrawingStyles interface is created, the direction attribute must initially have the value inherit.
|
(DOMString or CanvasGradient or CanvasPattern) | - fillStyle
- The fillStyle attribute represents the
color or style to use inside shapes, and the strokeStyle attribute represents the color
or style to use for the lines around the shapes.
|
DOMString | - font
- The font IDL attribute, on setting, must be
parsed the same way as the 'font' property of CSS (but without supporting property-independent
style sheet syntax like 'inherit'), and the resulting font must be assigned to the context, with
the 'line-height' component forced to 'normal', with the 'font-size' component converted to CSS
pixels, and with system fonts being computed to explicit values.
|
unrestricted double | - globalAlpha
- The globalAlpha attribute gives an
alpha value that is applied to shapes and images before they are composited onto the scratch
bitmap. The value must be in the range from 0.0 (fully transparent) to 1.0 (no additional
transparency). If an attempt is made to set the attribute to a value outside this range, including
Infinity and Not-a-Number (NaN) values, the attribute must retain its previous value.
|
DOMString | - globalCompositeOperation
- The globalCompositeOperation
attribute sets the current composition operator, which controls how shapes and images are drawn
onto the scratch bitmap, once they have had globalAlpha and the current transformation matrix
applied. The possible values are those defined in the Compositing and Blending specification.
|
unsigned long | - height
- The height attribute, on getting, must
return the height of the rendering context's scratch bitmap, in CSS pixels. On
setting, it must set bitmap dimensions
to the current width of the rendering context's scratch bitmap in CSS pixels and the
new value, respectively.
|
boolean | - imageSmoothingEnabled
- The imageSmoothingEnabled
attribute, on getting, must return the last value it was set to. On setting, it must be set to the
new value. When the CanvasRenderingContext2D object is created, the attribute must be
set to true.
|
DOMString | - lineCap
- The lineCap attribute defines the type
of endings that UAs will place on the end of lines. The three valid values are butt,
round, and square.
|
unrestricted double | - lineDashOffset
- It is sometimes useful to change the "phase" of the dash pattern, e.g. to achieve a "marching
ants" effect. The phase can be set using the lineDashOffset attribute. On getting, it
must return the current value. On setting, infinite and NaN values must be ignored, leaving the
value unchanged; other values must change the current value to the new value.
|
DOMString | - lineJoin
- The lineJoin attribute defines the type
of corners that UAs will place where two lines meet. The three valid values are
bevel, round, and miter.
|
unrestricted double | - lineWidth
- The lineWidth attribute gives the
width of lines, in coordinate space units. On getting, it must return the current value. On
setting, zero, negative, infinite, and NaN values must be ignored, leaving the value unchanged;
other values must change the current value to the new value.
|
unrestricted double | - miterLimit
- When the lineJoin attribute has the value
miter, strokes use the miter limit ratio to decide how to render joins. The miter
limit ratio can be explicitly set using the miterLimit attribute. On getting, it must
return the current value. On setting, zero, negative, infinite, and NaN values must be ignored,
leaving the value unchanged; other values must change the current value to the new value.
|
unrestricted double | - shadowBlur
- The shadowBlur attribute specifies
the level of the blurring effect. (The units do not map to coordinate space units, and are not
affected by the current transformation matrix.)
|
DOMString | - shadowColor
- The shadowColor attribute sets the
color of the shadow.
|
unrestricted double | - shadowOffsetX
- The shadowOffsetX and shadowOffsetY attributes specify the
distance that the shadow will be offset in the positive horizontal and positive vertical distance
respectively. Their values are in coordinate space units. They are not affected by the current
transformation matrix.
|
unrestricted double | - shadowOffsetY
- The shadowOffsetX and shadowOffsetY attributes specify the
distance that the shadow will be offset in the positive horizontal and positive vertical distance
respectively. Their values are in coordinate space units. They are not affected by the current
transformation matrix.
|
(DOMString or CanvasGradient or CanvasPattern) | - strokeStyle
- The fillStyle attribute represents the
color or style to use inside shapes, and the strokeStyle attribute represents the color
or style to use for the lines around the shapes.
|
DOMString | - textAlign
- The textAlign IDL attribute, on
getting, must return the current value. On setting, if the value is one of start, end, left, right, or center, then the value must be changed to the new
value. Otherwise, the new value must be ignored. When the object implementing the
CanvasDrawingStyles interface is created, the textAlign attribute must initially have the value start.
|
DOMString | - textBaseline
- The textBaseline IDL attribute, on
getting, must return the current value. On setting, if the value is one of top, hanging, middle, alphabetic, ideographic, or bottom, then the value must be changed to the
new value. Otherwise, the new value must be ignored.
|
unsigned long | - width
- The width attribute, on getting, must
return the width of the rendering context's scratch bitmap, in CSS pixels. On
setting, it must set bitmap dimensions
to the new value and the current height of the rendering context's scratch bitmap in
CSS pixels, respectively.
|
Operations |
void | addHitRegion(optional HitRegionOptions options) |
void | - arc(unrestricted double x, unrestricted double y, unrestricted double radius, unrestricted double startAngle, unrestricted double endAngle, optional boolean anticlockwise)
- The arc(x, y,
radius, startAngle, endAngle, anticlockwise) and ellipse(x, y, radiusX, radiusY, rotation, startAngle, endAngle, anticlockwise) methods draw arcs.
|
void | - arcTo(unrestricted double x1, unrestricted double y1, unrestricted double x2, unrestricted double y2, unrestricted double radius, optional unrestricted double radiusY, optional unrestricted double rotation)
- The arcTo(x1, y1, x2, y2, radiusX,
radiusY, rotation) method must first
ensure there is a subpath for (x1, y1). Then, the behavior depends on the arguments and the last point in the
subpath, as described below.
|
void | - beginPath()
- The beginPath() method must empty the
list of subpaths in the context's current default path so that the it once again has
zero subpaths.
|
void | - bezierCurveTo(unrestricted double cp1x, unrestricted double cp1y, unrestricted double cp2x, unrestricted double cp2y, unrestricted double x, unrestricted double y)
- The bezierCurveTo(cp1x,
cp1y, cp2x, cp2y, x, y) method must ensure there is a
subpath for (cp1x, cp1y), and
then must connect the last point in the subpath to the given point (x, y) using a cubic Bézier curve with control points (cp1x,
cp1y) and (cp2x, cp2y).
|
void | clearRect(unrestricted double x, unrestricted double y, unrestricted double w, unrestricted double h) |
void | - clip(optional any fillRule_path, optional CanvasFillRule fillRule)
- The clip() method must create a new
clipping region by calculating the intersection of the current clipping region and the
area described by the intended path, using the fill rule indicated by the fillRule argument. Open subpaths must be implicitly closed when computing the
clipping region, without affecting the actual subpaths.
|
void | - closePath()
- The closePath() method must do nothing
if the object's path has no subpaths. Otherwise, it must mark the last subpath as closed, create a
new subpath whose first point is the same as the previous subpath's first point, and finally add
this new subpath to the path.
|
void | commit() |
ImageData | - createImageData(any sw_imagedata, optional double sh)
- The ImageData() constructors and the createImageData() methods are used to
instantiate new ImageData objects.
|
CanvasGradient | - createLinearGradient(double x0, double y0, double x1, double y1)
- The createLinearGradient(x0, y0, x1, y1) method takes four arguments that represent the start point (x0, y0) and end point (x1, y1) of the gradient. The method must return a linear CanvasGradient
initialized with the specified line.
|
CanvasPattern | - createPattern(CanvasImageSource image, DOMString repetition)
- To create objects of this type, the createPattern(image, repetition) method is used.
|
CanvasGradient | - createRadialGradient(double x0, double y0, double r0, double x1, double y1, double r1)
- The createRadialGradient(x0, y0, r0, x1, y1, r1) method takes six arguments, the first
three representing the start circle with origin (x0, y0)
and radius r0, and the last three representing the end circle with origin
(x1, y1) and radius r1. The values are
in coordinate space units.
|
boolean | drawCustomFocusRing(any element_path, optional Element element) |
void | - drawImage(CanvasImageSource image, unrestricted double dx_sx, unrestricted double dy_sy, optional unrestricted double dw_sw, optional unrestricted double dh_sh, optional unrestricted double dx, optional unrestricted double dy, optional unrestricted double dw, optional unrestricted double dh)
- To draw images, the drawImage method
can be used.
|
void | drawSystemFocusRing(any element_path, optional Element element) |
void | - ellipse(unrestricted double x, unrestricted double y, unrestricted double radiusX, unrestricted double radiusY, unrestricted double rotation, unrestricted double startAngle, unrestricted double endAngle, optional boolean anticlockwise)
- The arc(x, y,
radius, startAngle, endAngle, anticlockwise) and ellipse(x, y, radiusX, radiusY, rotation, startAngle, endAngle, anticlockwise) methods draw arcs.
|
void | - fill(optional any fillRule_path, optional CanvasFillRule fillRule)
- The fill() method must fill all the
subpaths of the intended path, using fillStyle, and
using the fill rule indicated by the fillRule argument. Open
subpaths must be implicitly closed when being filled (without affecting the actual subpaths).
|
void | - fillRect(unrestricted double x, unrestricted double y, unrestricted double w, unrestricted double h)
- The fillRect(x, y, w, h) method must paint the
specified rectangular area using the fillStyle. If
either height or width are zero, this method has no effect.
|
void | - fillText(DOMString text, unrestricted double x, unrestricted double y, optional unrestricted double maxWidth)
- The fillText() and strokeText() methods take three or four
arguments, text, x, y, and optionally
maxWidth, and render the given text at the given (x, y) coordinates ensuring that the text isn't wider than maxWidth if specified, using the current font, textAlign,
and textBaseline values.
|
ImageData | - getImageData(double sx, double sy, double sw, double sh)
- The getImageData(sx,
sy, sw, sh) method must,
if either the sw or sh arguments are zero, throw an
IndexSizeError exception; otherwise,
if the scratch bitmap's origin-clean
flag is set to false, it must throw a SecurityError exception;
otherwise, it must return an ImageData object with width sw and
height sh representing the scratch bitmap for the area of that
bitmap denoted by the rectangle whose corners are the four points (sx, sy), (sx+sw, sy), (sx+sw,
sy+sh), (sx,
sy+sh), in the bitmap's
coordinate space units.
|
sequence<unrestricted double> | - getLineDash()
- When the getLineDash() method is
invoked, it must return a sequence whose values are the values of the object's dash
list, in the same order.
|
boolean | - isPointInPath(any x_path, unrestricted double y_x, optional any fillRule_y, optional CanvasFillRule fillRule)
- The isPointInPath() method must
return true if the point given by the x and y coordinates
passed to the method, when treated as coordinates in the canvas coordinate space unaffected by the
current transformation, is inside the intended path as determined by the fill rule
indicated by the fillRule argument; and must return false otherwise.
|
boolean | - isPointInStroke(any x_path, unrestricted double y_x, optional unrestricted double y)
- The isPointInStroke() method
must return true if the point given by the x and y
coordinates passed to the method, when treated as coordinates in the canvas coordinate space
unaffected by the current transformation, is inside the path that results from tracing the intended path, using the non-zero winding rule, and using the
CanvasRenderingContext2D object for the line styles; and must return false otherwise.
|
void | - lineTo(unrestricted double x, unrestricted double y)
- The lineTo(x, y) method must ensure there is a subpath for (x, y) if the object's path has no
subpaths. Otherwise, it must connect the last point in the subpath to the given point (x, y) using a straight line, and must then add the given point
(x, y) to the subpath.
|
TextMetrics | - measureText(DOMString text)
- The measureText() method takes one
argument, text. When the method is invoked, the user agent must run the
text preparation algorithm, passing it text and the
CanvasRenderingContext2D object, and then using the returned inline box must create a
new TextMetrics object with its attributes set as described in the following list.
|
void | - moveTo(unrestricted double x, unrestricted double y)
- The moveTo(x, y) method must create a new subpath with the specified point as its
first (and only) point.
|
void | - putImageData(ImageData imagedata, double dx, double dy, optional double dirtyX, optional double dirtyY, optional double dirtyWidth, optional double dirtyHeight)
- The putImageData() method writes
data from ImageData structures back to the rendering context's scratch
bitmap. Its arguments are: imagedata, dx, dy, dirtyX, dirtyY, dirtyWidth, and dirtyHeight.
|
void | - quadraticCurveTo(unrestricted double cpx, unrestricted double cpy, unrestricted double x, unrestricted double y)
- The quadraticCurveTo(cpx, cpy, x, y) method must ensure there is a subpath for (cpx, cpy), and then must connect the last
point in the subpath to the given point (x, y) using a
quadratic Bézier curve with control point (cpx, cpy), and must then add the given point (x, y) to the subpath.
|
void | - rect(unrestricted double x, unrestricted double y, unrestricted double w, unrestricted double h)
- The rect(x, y,
w, h) method must create a new subpath
containing just the four points (x, y), (x+w, y), (x+w, y+h), (x, y+h), in that order, with those four points connected by straight lines, and
must then mark the subpath as closed. It must then create a new subpath with the point (x, y) as the only point in the subpath.
|
void | removeHitRegion(DOMString id) |
void | - resetClip()
- The resetClip() method must create a
new clipping region that is the largest infinite surface. The new clipping region
replaces the current clipping region.
|
void | - resetTransform()
- The resetTransform() method must
reset the current transform to the identity matrix.
|
void | - restore()
- The restore() method must pop the top
entry in the drawing state stack, and reset the drawing state it describes. If there is no saved
state, the method must do nothing.
|
void | - rotate(unrestricted double angle)
- The rotate(angle)
method must add the rotation transformation described by the argument to the transformation
matrix. The angle argument represents a clockwise rotation angle expressed in
radians.
|
void | - save()
- The save() method must push a copy of the
current drawing state onto the drawing state stack.
|
void | - scale(unrestricted double x, unrestricted double y)
- The scale(x, y) method must add the scaling transformation described by the
arguments to the transformation matrix. The x argument represents the scale
factor in the horizontal direction and the y argument represents the scale
factor in the vertical direction.
|
void | scrollPathIntoView(optional Path2D path) |
void | setLineDash(sequence<unrestricted double> segments) |
void | - setTransform(unrestricted double a, unrestricted double b, unrestricted double c, unrestricted double d, unrestricted double e, unrestricted double f)
- The setTransform(a, b, c, d, e, f) method must reset the current transform to the identity matrix, and
then invoke the transform(a, b, c, d, e, f) method with the same arguments.
|
void | - stroke(optional Path2D path)
- The stroke() method must trace the intended path, using the
CanvasRenderingContext2D object for the line styles, and then fill the resulting path
using the strokeStyle attribute, using the non-zero winding rule.
|
void | - strokeRect(unrestricted double x, unrestricted double y, unrestricted double w, unrestricted double h)
- The strokeRect(x, y, w, h) method must take the
result of tracing the path described below, using the
CanvasRenderingContext2D object's line styles, and fill it with the strokeStyle.
|
void | - strokeText(DOMString text, unrestricted double x, unrestricted double y, optional unrestricted double maxWidth)
- The fillText() and strokeText() methods take three or four
arguments, text, x, y, and optionally
maxWidth, and render the given text at the given (x, y) coordinates ensuring that the text isn't wider than maxWidth if specified, using the current font, textAlign,
and textBaseline values.
|
void | transform(unrestricted double a, unrestricted double b, unrestricted double c, unrestricted double d, unrestricted double e, unrestricted double f) |
void | - translate(unrestricted double x, unrestricted double y)
- The translate(x, y) method must add the translation transformation described by the
arguments to the transformation matrix. The x argument represents the
translation distance in the horizontal direction and the y argument represents
the translation distance in the vertical direction.
|